<template>
    <n-card :bordered="false" class="proCard">

        <BasicTable :columns="columns" :request="loadDataTable" :row-key="(row: ListDataAboutRepairApplyList) => row.id"
            ref="actionRef"  @update:checked-row-keys="onCheckedRow" :scroll-x="1090">
        </BasicTable>


    </n-card>
</template>

<script lang="ts" setup>
import { h, reactive, ref } from 'vue';
import { BasicTable, TableAction } from '@/components/Table';
import { BasicForm, FormSchema, useForm } from '@/components/Form/index';

//axios 
import { getTableListAboutLabBorrow, submitFinishUsing } from '@/api/student/student';
import { getTableListAboutRepairApplyList, } from '@/api/teacher/teacher';
import { columnsAboutRepairApplyList, ListDataAboutRepairApplyList } from './columns';


import { PlusOutlined } from '@vicons/antd';
import { useRouter } from 'vue-router';
import { type FormRules, NButton, NInput, useMessage } from 'naive-ui';


const columns = ref(columnsAboutRepairApplyList);


const schemas: FormSchema[] = [
    {
        field: 'name',
        labelMessage: '这是一个提示',
        component: 'NInput',
        label: '姓名',
        componentProps: {
            placeholder: '请输入姓名',
            onInput: (e: any) => {
                console.log(e);
            },
        },
        rules: [{ required: true, message: '请输入姓名', trigger: ['blur'] }],
    },
    {
        field: 'mobile',
        component: 'NInputNumber',
        label: '手机',
        componentProps: {
            placeholder: '请输入手机号码',
            showButton: false,
            onInput: (e: any) => {
                console.log(e);
            },
        },
    },
    {
        field: 'type',
        component: 'NSelect',
        label: '类型',
        componentProps: {
            placeholder: '请选择类型',
            options: [
                {
                    label: '舒适性',
                    value: 1,
                },
                {
                    label: '经济性',
                    value: 2,
                },
            ],
            onUpdateValue: (e: any) => {
                console.log(e);
            },
        },
    },
    {
        field: 'makeDate',
        component: 'NDatePicker',
        label: '预约时间',
        defaultValue: 1183135260000,
        componentProps: {
            type: 'date',
            clearable: true,
            onUpdateValue: (e: any) => {
                console.log(e);
            },
        },
    },
    {
        field: 'makeTime',
        component: 'NTimePicker',
        label: '停留时间',
        componentProps: {
            clearable: true,
            onUpdateValue: (e: any) => {
                console.log(e);
            },
        },
    },
    {
        field: 'status',
        label: '状态',
        //插槽
        slot: 'statusSlot',
    },
    {
        field: 'makeProject',
        component: 'NCheckbox',
        label: '预约项目',
        componentProps: {
            placeholder: '请选择预约项目',
            options: [
                {
                    label: '种牙',
                    value: 1,
                },
                {
                    label: '补牙',
                    value: 2,
                },
                {
                    label: '根管',
                    value: 3,
                },
            ],
            onUpdateChecked: (e: any) => {
                console.log(e);
            },
        },
    },
    {
        field: 'makeSource',
        component: 'NRadioGroup',
        label: '来源',
        componentProps: {
            options: [
                {
                    label: '网上',
                    value: 1,
                },
                {
                    label: '门店',
                    value: 2,
                },
            ],
            onUpdateChecked: (e: any) => {
                console.log(e);
            },
        },
    },
];

const router = useRouter();
// const formRef: any = ref(null);
const actionRef = ref();

const showModal = ref(false);
const formBtnLoading = ref(false);
const formParams = reactive({
    name: '',
    address: '',

    id: '',
    username: '',
    account: '',
    role: '',
    pro_rank: '',
    major: '',
    class_name: '',

});

const actionColumn = reactive({
    width: 220,
    title: '操作',
    key: 'action',
    fixed: 'right',
    render(record: any) {
        return h(TableAction as any, {
            style: 'NButton',
            actions: [
                {
                    label: '修改申请',
                    onClick: handleModifyLabborrow.bind(null, record),
                    type: 'info',
                    // 根据业务控制是否显示 isShow 和 auth 是并且关系
                    ifShow: () => {
                        return isPermitBorrow(record);
                    },

                },
                {
                    label: '使用结束',
                    type: 'success',
                    onClick: handleFinishLabborrow.bind(null, record),
                    // 根据业务控制是否显示 isShow 和 auth 是并且关系
                    ifShow: () => {
                        return submitFinishBorrow(record);
                    },

                },

            ],
        });
    },
});
function isPermitBorrow(record: any) {
    // 逻辑待补充
    return record.state == 0
}

function submitFinishBorrow(record: any) {
    // console.log("record",)
    return record.state == 1
}


const [register, { getFieldsValue }] = useForm({
    gridProps: { cols: '1 s:1 m:2 l:3 xl:4 2xl:4' },
    labelWidth: 80,
    schemas,
});

function addTable() {
    showModal.value = true;
}

var pageNum
const loadDataTable = async (res: any) => {
    pageNum = res.page

    return await getTableListAboutRepairApplyList({...res, "pageNum": pageNum })
    // return await getTableListAboutLabBorrow({ });



};

function onCheckedRow(rowKeys: any) {
    console.log(rowKeys);
}

function reloadTable() {
    actionRef.value.reload();
}

function confirmForm(e: { preventDefault: () => void; }) {
    e.preventDefault();
    formBtnLoading.value = true;
    formRef.value.validate((errors: any) => {
        if (!errors) {
            window['$message'].success('新建成功');
            setTimeout(() => {
                showModal.value = false;
                reloadTable();
            });
        } else {
            window['$message'].error('请填写完整信息');
        }
        formBtnLoading.value = false;
    });
}
// handleResetPassword
function handleModifyLabborrow(record: Recordable) {

    console.log('点击了handleModifyLabborrow', record);
   
    window['$message'].success('修改信息');


    addTable()
    //router.push({ name: 'basic-info', params: { id: record.id } });
}


function handleFinishLabborrow(record: Recordable) {
    submitFinishUsing(record)
    reloadTable();
}

function handleSubmit(values: Recordable) {
    console.log(values);
    reloadTable();
}

function handleReset(values: Recordable) {
    console.log(values);
}

function searchPerson() {
    console.log("selectOptionValue:", selectOptionValue.value)
    reloadTable()
}


// 修改用户表单
const weekList = [
    {
        label: '1',
        value: 1,
    },
    {
        label: '2',
        value: 2,
    },

];

const sectionList = [
    {
        label: '1-2',
        value: 1,
    },
    {
        label: '3-4',
        value: 2,
    },

];

const labNameList = [
    {
        label: '基础实验室',
        value: 1,
    },

];

const rules = {

};

const formRef: any = ref(null);
const message = useMessage();


let labBorrowRef = reactive({
    semester: '',

    start_week: '',
    end_week: '',

    section: '',

    lad_id: '',
    lab_name: '',



    reason: '',
    create_time: '',
});


function formSubmit() {
    formRef.value.validate((errors) => {
        if (!errors) {
            let result = labBorrowRef
            console.log(labBorrowRef)
            message.success("验证成功");
        } else {
            message.error('验证失败，请填写完整信息');
        }
    });
}

</script>

<style lang="less" scoped></style>